<div class="row">
    <div class="col-md-12">
        <div class="tile">
            <div class="tile-body">
                <table class="table table-hover table-bordered" id="sampleTable">
                    <thead>
                    <tr>
                        <th>id</th>
                        <th>名称</th>
                        <th>修改时间</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>

                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
</main>

<script type="text/javascript">
    function del(id) {
        if (confirm("确定要删除数据吗？")) {
            $.ajax({
                type: "POST",
                url: "/group/del",
                data: {"Id": id},
                success: function (res) {
                    alert(res.msg)
                    if (res.status) {
                        document.location.reload();
                    }
                }
            })
        }
    }
    function edit(id) {
        window.location.href = "/group/edit?id=" + id
    }

    function add() {
        window.location.href = "/group/add"
    }

    $(document).ready(function () {
        var table = $('#sampleTable').DataTable({
            dom: 'Bfrtip',
            processing: true,
            serverSide: true,
            autoWidth: false,
            ordering: false,
            ajax: {
                url: '/group/list',
                type: 'POST'
            },
            dom: '<"top"fl><"toolbar">rt<"bottom"ip><"clear">',
            fnServerParams: function (data) {
                data["group"] = $("#group  option:selected").val()
                console.log(data)
            },
            columns: [　//这个是显示到界面上的个数据　格式为 {data:'显示的字段名'}
                {data: 'Id'},
                {data: 'Title'},
                {data: 'UpdateTime'},
                {data: "Id"}
            ],
            bFilter: false,
            columnDefs: [{
                targets: -1,
                render: function (data, type, row, meta) {
                    return '<div class="btn-group" role="group" aria-label="..."> ' +
                            '<button onclick="del(' + row.Id + ')" type="button"   class="btn btn-danger btn-sm">删除</button>' +
                            '<button onclick="edit(' + row.Id + ')" type="button"   class="btn btn-primary btn-sm">查看编辑</button> '
                }
            }
            ],
            buttons: []
        });

        $("#sampleTable_length").html('<button class="btn btn-primary" onclick="add()" type="button">新增</button>');
    })
    ;

</script>
